Ext.onReady(function() {
	function fn_submitForm() {
		if (loginForm.form.isValid()) {// 验证合法后使用加载进度条
			var code = document.getElementById('validateCode').value;
			if (code == "") {
				Ext.Msg.alert("警告", "您没有输入验证码!");
				document.getElementById("validateCode").focus();
				return;
			}
			var conn = Ext.lib.Ajax.getConnectionObject().conn;
			// 验证验证码
			conn.open("POST", 'loginAction!checkMaskCode.action', false);
			conn.setRequestHeader("Content-Type",
					"application/x-www-form-urlencoded;charset=UTF-8");
			conn.send("validateCode=" + code);
			var responseTextVale = Ext.util.JSON.decode(conn.responseText);
			if (responseTextVale.msg == 'error') {
				Ext.Msg.alert("警告", "验证码输入错误或已失效，请重新输入！");
				code = "";
				changeImg(document.getElementById("photo"));
				document.getElementById("validateCode").value = "";
				return;
			}
			// 验证码验证结束
			// 验证用户账户是否被冻结开始
			conn.open("POST", 'loginAction!checkIsValid.action', false);
			conn.setRequestHeader("Content-Type",
					"application/x-www-form-urlencoded;charset=UTF-8");
			conn.send('name='
					+ Ext.getCmp('login').form.findField('j_username')
							.getValue());
			var responseTextVale = Ext.util.JSON.decode(conn.responseText);
			if (responseTextVale.msg == 'error') {
				Ext.Msg.alert("警告", "您的账户已经被冻结,请联系管理员!");
				return;
			}
			// 验证用户账户是否被冻结结束
			Ext.MessageBox.show({
						title : '请稍等',
						msg : '正在登陆...',
						progressText : '',
						width : 300,
						progress : true,
						closable : false,
						animEl : 'loading'
					});

			// 控制进度速度
			var f = function(v) {
				return function() {
					var i = v / 11;
					Ext.MessageBox.updateProgress(i, '');
				};
			};

			for (var i = 1; i < 12; i++) {
				setTimeout(f(i), i * 150);
			}
			// 提交到服务器操作
			Ext.Ajax.request({
				url : 'j_spring_security_check',
				params : {
					j_username : document.getElementById("j_username").value,
					j_password : document.getElementById("j_password").value,
					// _spring_security_remember_me :
					// document.getElementById("_spring_security_remember_me").value,//Ext.getCmp('login').form.findField('_spring_security_remember_me').getValue(),
					ajax : true
				},
				failure : function(response) {
					var status = response.status;
					var msg = response.statusText;
					if (status == 998) {
						window.open(
										"index.jsp",
										"_self",
										"toolbar=no,status=yes,menubar=no,scrollbars=no,resizable=no,width=1016,height=700,left=0,top=0");
					} else if (status == 1000) {
						Ext.Msg.alert("警告", "密码连续三次输入错误,账户锁定到session失效!");
					} else if (status == 999) {
						Ext.Msg.alert("警告", "用户名或者密码错!");
						changeImg(document.getElementById("photo"));
					} else {
						Ext.Msg.alert('错误', '服务器出现错误请稍后再试！');
						changeImg(document.getElementById("photo"));
					}
				}
			});
		}
	}
	Ext.state.Manager.setProvider(new Ext.state.CookieProvider());
	// 使用表单提示
	Ext.QuickTips.init();
	Ext.form.Field.prototype.msgTarget = 'side';

	// 定义表单
	var loginForm = new Ext.FormPanel({
		title : '用户登录',
		labelAlign : "left",
		frame : true,
		border:true,
		renderTo : "login",
		monitorValid : true,// 把有formBind:true的按钮和验证绑定
		id : 'login',
		width : 200,
		height : 160,
		labelWidth : 50,
		defaults : {
			bodyStyle : "padding:2px"
		},
		items : [{
			layout : 'column',
			items : [{
				columnWidth : 1,
				layout : 'form',
				items : [{
					xtype : 'textfield',
					fieldLabel : '用户名',
					name : 'j_username',
					id : 'j_username',
					value : 'admin',
					width : 120,
					allowBlank : false,
					blankText : '帐号不能为空',
					emptyText : '请输入帐号名称',
					listeners : {
						specialkey : function(f, e) {
							if (e.getKey() == e.ENTER || e.getKey() == e.TAB) {
								Ext.getCmp("j_password")
										.selectText(
												0,
												Ext.getCmp("j_password")
														.getValue().length);
							}
						}
					}
				}]
			}, {
				columnWidth : 1,
				layout : 'form',
				items : [{
					xtype : 'textfield',
					name : 'j_password',
					id : 'j_password',
					fieldLabel : '密&nbsp;&nbsp;&nbsp;码',
					value : 'admin',
					width : 120,
					allowBlank : false,
					inputType : 'password',
					listeners : {
						specialkey : function(f, e) {
							if (e.getKey() == e.ENTER || e.getKey() == e.TAB) {
								document.getElementById("validateCode").value = "";
								document.getElementById("validateCode").focus();
							}
						}
					}
				}]
			}, {
				columnWidth : .6,
				layout : 'form',
				items : [{
					name : 'validateCode',
					id : 'validateCode',
					xtype : 'textfield',
					fieldLabel : '验证码',
					regex : /^[0-9]{4}$/,
					regexText : '图片不清楚吗？请点击图片进行刷新，验证码为4位数字!',
					width : 47,
					allowBlank : false,
					emptyText : '验证码',
					blankText : '验证码不能为空!',
					listeners : {
						specialkey : function(f, e) {
							if (e.getKey() == e.ENTER) {
								fn_submitForm();
							}
						}
					}
				}]
			}, {
				columnWidth : .4,
				layout : 'form',
				items : [{
					html : '<img id="photo" alt="点击更换验证码" src="loginAction!generateCode.action" onmousedown="changeImg(this)"/>'
				}]
			}]

		}],
		buttons : [{
					text : '登陆',
					id : 'frm_submit',
					formBind : true,
					type : 'submit',
					handler : function() {
						fn_submitForm();
					}
				}, {
					text : '取消',
					handler : function() {
						loginForm.form.reset();
						changeImg(document.getElementById("photo"));
					}// 重置表单
				}]
	});
	Ext.getCmp("j_username").selectText(0,
			Ext.getCmp("j_username").getValue().length);
});
// 点击更换验证码
function changeImg(obj) {
	obj.src = "loginAction!generateCode.action?ss=" + Math.random();
}